<template>
    <div >
        <!--    搜索表单-->
        <div style="margin-bottom: 20px">
            <span style="float:left;margin-top:24px;font-size: large">患者信息:</span>
            <el-tag  style="float:left;margin-top:12px;  width: 80px;" type="success;" >挂号id:{{ RegisterForm.id }}</el-tag>
            <el-tag  style="float:left;margin-top:12px;  width: 80px;" type="success;" >姓名:{{ RegisterForm.realName}}</el-tag>
            <el-tag  style="float:left;margin-top:12px;width: 110px;" type="success;">病历号:{{ RegisterForm.caseNumber }}</el-tag>
            <el-tag style="float:left;margin-top:12px;">年龄{{ RegisterForm.age }}</el-tag>
            <el-tag style="float:left;margin-top:12px;">性别{{ RegisterForm.gender }}</el-tag>
            <br><br>
            <br>
            <el-divider ></el-divider>
            <div style="float: left;top:0px">
                <i  style="font-size: x-large" class="el-icon-document-checked"></i><span style="font-weight:bold;font-size:x-large">检验项目</span>
            </div>
            <br>
        </div>
        <el-divider ></el-divider>
        <br>
        <el-table :data="tableData" style="margin-top: -20px" stripe>
            <el-table-column  label="检验编码"  prop="techCode"></el-table-column>
            <el-table-column  label="检验名称" prop="techName"></el-table-column>
            <el-table-column  label="检验规格"  prop="techType"></el-table-column>
            <el-table-column label="单价" prop="techPrice"></el-table-column>
            <el-table-column label="费用分类" prop="priceType"></el-table-column>
        </el-table>
        <el-tag style="float:left;margin-top:12px;width: 160px;font-size: medium" type="success;">已选择的检验项目:</el-tag>
         <div class="verify">
        <span style="float:left;margin-left:-160px;margin-top:78px;font-size: larger;font-weight: bold">确定检验科室和检验医生</span>

             <el-form style="float:left;margin-left:-210px;margin-top:116px;" :inline="true" :model="formInline" class="demo-form-inline">
                 <el-form-item label="科室选择">
                     <el-select v-model="formInline1.doctor" placeholder="选择科室">
                         <el-option label="科室一" value="shanghai"></el-option>
                         <el-option label="科室二" value="beijing"></el-option>
                     </el-select>
                 </el-form-item>
                 <el-form-item label="医生选择">
                     <el-select v-model="formInline2.doctor" placeholder="选择医生">
                         <el-option label="医生一" value="shanghai"></el-option>
                         <el-option label="医生二" value="beijing"></el-option>
                     </el-select>
                 </el-form-item>
             </el-form>
             <br>
             <el-button style="float:left;margin-left:-600px;margin-top: 180px;width: 100px" type="primary" @click="open3">开始检验</el-button>
             <el-button style="float:left;margin-left:-481px;margin-top: 180px;width: 100px" type="primary" >重置医生</el-button>
         </div>

    </div>
</template>
<script>
    import axios from "axios";

    export default {
        mounted() {
            //从创建病历按钮中的界面获取挂号id和病历id
            this.RegisterForm.id = this.$route.params.registerId;//挂号id

            console.log("挂号id:  " + this.RegisterForm.id)
            //将该患者的挂号id储存到session中，同名的应该会覆盖掉，所以不用清除
            sessionStorage.setItem('registerId', this.RegisterForm.id)
            //初始化患者信息
            this.init()
        },
        created() { //页面加载时执行查询方法
        },
        data() {
            return {
                RegisterForm: {//储存患者信息
                    id: '',//挂号id
                    realName: '',
                    caseNumber: '',
                    age: '',
                    gender: ''
                },
                ConfirmCheckTable: [{
                    id: '',
                    techCode: '',
                    techName: '',
                    techPrice: '',
                    techType:'',
                    priceType:''
                }],
                tableData:[],
                formInline1: {
                    user: '',
                    doctor: ''
                },
                formInline2: {
                    user: '',
                    doctor: ''
                },
            }
        },
        methods: {

            //拿到挂号id后去搜索对应患者信息，展示在前端上
            async init() {
                //初始化患者信息
                await axios.post("http://127.0.0.1:8088/inspection/lectById", { id: this.RegisterForm.id  }).then((res) => {
                    console.log(res.data.data)
                    //绑定数据
                    this.RegisterForm= res.data.data
                    this.$message({
                        message: '患者信息初始化成功',
                        type: 'success'
                    })

                    this.dialogFormVisible = false;
                    //this.init();
                }).catch(error=>{
                    console.log(error)
                });
                await axios.post("http://127.0.0.1:8088/inspection/select2",{id: this.ConfirmCheckTable.id}).then((res) => {
                    this.tableData= res.data.data
                    console.log(this.tableData)
                });
            },
            open3() {
                this.$message({
                    message: '开始检验',
                    type: 'success'
                });
            },
            onSubmit() {
                console.log('submit!');
            },

        }
    }
</script>
<style scoped>
</style>